<template>
    <div class="cadBind">
        <div class="condition">
            <el-form ref="form" :model="formSearch" label-width="50px">
                <el-form-item label="项目">
                    <el-select v-model="formSearch.xqId" placeholder="请选择项目" size="mini" @change="changeProject">
                        <el-option v-for="item in xqSelect" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>

                </el-form-item>
            </el-form>
            <!-- <div> -->
            <slot name="btnName"></slot>
            <!-- 能耗按钮 -->
            <div class="btn">
                <div v-if="$route.path == '/iot_ems'">
                    <el-button size="mini" class="btn" @click="$router.push('/nenghao_config')">基础配置</el-button>
                    <el-button size="mini" class="btn" @click="$router.push('/energyManage')">能耗统计</el-button>
                    <el-button size="mini" class="btn" @click="$router.push('/energyAnalysis')">能耗分析</el-button>
                </div>
                <slot name="btn"></slot>
            </div>
            <!-- 门禁按钮 -->
            <div class="btn">
                <!-- <div v-if="$route.path == '/iot_acs'">
                    <el-button size="mini" class="btn" @click="getEquipment">同步门禁设备</el-button>
                    <el-button size="mini" class="btn" @click="getPersonnelInformation">同步人员门禁信息</el-button>
                </div> -->
                <div v-if="$route.path == '/iot_acs' || $route.path == '/iot_cis'">
                    <el-button size="mini" class="btn" @click="$route.path == '/iot_acs'?viewType=4:viewType=5,cardshow = false" :type="viewType == 5 && !cardshow?'primary':''">开门日志</el-button>
                </div>
            <!-- 对讲按钮 -->
                <div v-if="$route.path == '/iot_acs'">
                    <el-button size="mini" class="btn" @click="viewType=6,cardshow = false" :type="viewType == 6 && !cardshow?'primary':''">故障记录</el-button>
                    <el-button size="mini" class="btn" @click="viewType=7,cardshow = false" :type="viewType == 7 && !cardshow?'primary':''">报警记录</el-button>
                </div>
            <!-- 烟感按钮 -->
                <div v-if="$route.path == '/iot_sense'">
                    <el-button size="mini" class="btn" @click="setSense">同步设备</el-button>
                    <el-button size="mini" class="btn" @click="changeLogType('state')" :type="isfocus == 1&& !cardshow?'primary':''">报警日志</el-button>
                    <el-button size="mini" class="btn" @click="changeLogType('action')" :type="isfocus == 2&& !cardshow?'primary':''">操作日志</el-button>
                </div>
                <div v-if="$route.path == '/iot_dmb'">
                    <el-button size="mini" class="btn" @click="getsyncTerminalsEquipment">同步终端信息</el-button>
                </div>
            </div>
            <!-- 左边区域下拉框  默认区域下拉框 -->
            <template class="sectionFilter">
                <slot name="sectionFilter">
                    <!-- v-if="viewType==1" -->
                    <el-tree :data="sectionTree" :props="defaultProps" :accordion="true"
                        :default-checked-keys="checkedkeys" node-key="id" ref="sectionTree"
                        :default-expanded-keys="defaultExpand" v-show="$route.path != '/iot_cps'">
                        <div class="custom-tree-node" slot-scope="{ node, data }">
                            <el-radio-group v-model="sectionId" @change="changeRadio(data)">
                                <el-radio :label="data.id"><span>{{ data.name }}</span></el-radio>
                            </el-radio-group>
                        </div>
                    </el-tree>
                </slot>
            <!-- 原来位置 -->
            </template>
        </div>
        
        <div class="searchBox" id="drawerDevList">
            <div class="searchTip" v-if="viewType!=1 && viewType!=2 && viewType!=3 ">
                <slot name="searchTips"></slot>
                <iotAcsLogSearch v-if="viewType==4"></iotAcsLogSearch>
                <iotCisLogSearch v-if="viewType==5"></iotCisLogSearch>
                <iotCisLogSearch2 v-if="viewType==6"></iotCisLogSearch2>
                <iotSenseLogSearch v-if="viewType==7" :logType="logType"></iotSenseLogSearch>
            </div>
        
            <slot name="parkingdata" v-if="viewType!=1 && viewType!=2 && viewType!=3 "></slot>
            <iotSenseLog v-if="viewType==7 && !cardshow" :logType="logType"></iotSenseLog>
            <iotAcsLog v-if="viewType==4 && !cardshow"></iotAcsLog>
            <iotCisLog v-if="viewType==5 && !cardshow"></iotCisLog>
            <iotCisLog2 v-if="viewType==6 && !cardshow"></iotCisLog2>
            <div class="operateBar" v-show="cardshow">
                <div>
                    <div class="operateTop">
                        <el-breadcrumb separator="/">
                            <el-breadcrumb-item v-for="(item) in checkedSectionList" :key="item.id">{{item.name}}
                            </el-breadcrumb-item>
                        </el-breadcrumb>
                        <div class="viewType">
                            <span :class="{nav_option_active:viewType==1}" @click="viewType=1">空间展示</span>
                            <span v-if="!pagePath.includes(this.$route.path)" :class="{nav_option_active:viewType==2}" @click="viewType=2">列表展示</span>
                            <span v-if="!pagePath.includes(this.$route.path)" :class="{nav_option_active:viewType==3}"
                                @click="viewType=3">设备展示</span>
                        </div>
                    </div>
                </div>
                <div style="height:100%;display:flex;">
                    <el-button size="small" @click="$router.push('/iot_pms_tongji') " v-if="$route.path == '/iot_pms'">
                        统计</el-button>
                    <slot name="search"></slot>
                </div>
            </div>
            <!-- <div id="drawerDevList"> -->
            <!-- && $route.path == '/iot_device_point' -->
            <!-- 暂无图片提示！ -->
            <div v-show="uploadFlag && viewType==1 " class="noImg">
                <div>
                    <div>暂未配置！</div>
                    <el-upload v-if="$route.path == '/iot_device_2d'" class="upload-demo" ref="upload"
                        :action="uploadPath" :limit="1" :multiple="false" :on-exceed="handleExceed"
                        :on-success="handleSuccess" :file-list="fileList">
                        <el-button size="small" type="primary" title="请选择区域">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传一张图片</div>
                    </el-upload>
                </div>
            </div>
            <!-- 底图 -->
            <keep-alive>
                <div v-show="bindPoint.url && viewType==1 && viewType!=0" class="cadImg" id="cadImg">
                    <!-- :style="'background:url('+bindPoint.url+')'" -->
                    <!-- 
                    用个div作为底图，将新增和回显的点都在放div中，
                 -->
                 <!-- :style="{transform:`translate(${chaX}px , ${chaY}px) scale(${zoom})`,transformOrigin:'0 0',userSelect:'none'}" -->
                    <div ref="img" :style="{transform:`translate(${chaX}px , ${chaY}px) scale(${zoom})`,transformOrigin:'0 0',userSelect:'none'}" >
                        <img  :src="bindPoint.url" ref="cad" alt="图片加载失败..." @mousedown.prevent="dragStart"
                            @mousemove="moveImg" @mouseleave="dragOver" @mouseup="dragEnd"
                            @mousewheel.prevent='zoomImg'>

                        <!-- 绑点 -->
                        <!-- <span style="width:32px;height:32px;position:absolute;zIndex:9999;" class="mark"></span> -->
                        <!-- 回显点 -->
                        <point ref="pointRef" :pointList="pointList" :deviceSys="devSubsystem"
                            :systemItemType="systemItemType" :zoom="zoom" :imgH="imgH" :imgW="imgW"
                            :xqId="formSearch.xqId" :closeCamera="cameraInfo.dialogVisible" @getPointList="getPointList"
                            @delPointList="delPointList" @getCameraInfo="getCameraInfo"
                            @getNewpoint="getNewpoint"
                            >
                        </point>
                    </div>
                    <!-- :devSubsystem="devSubsystem" -->
                </div>
            </keep-alive>
            <!-- 表格 -->
            <keep-alive>
                <div class="commonTable" v-if="viewType==2">
                    <slot name="data">
                        <div>
                            <devicelistv :devicedata="deviceDataList"></devicelistv>
                        </div>
                    </slot>
                </div>
            </keep-alive>
            <!-- 设备展示 -->
            <div class="commonTable" v-if="viewType==3">
                <div class="deviceviewbox">
                    <!-- v-if="this.$route.path!='/iot_ba_ecs'" -->
                    
                    <!-- 电梯设备 -->
                    <diantiCard v-if="$route.path=='/iot_ba_ecs'" @readData="readData"
                        v-for="(item) in  devicedata" :key="item.id" :devicedata="item"
                        :IbmsDeviceReadDTO="IbmsDeviceReadDTO">
                    </diantiCard>
                    <!-- 监控设备 -->
                    <videomonitoringsystem v-if="$route.path=='/iot_vscs'" :devicedata="devicedata">
                    </videomonitoringsystem>
                    <!-- 门禁系统 -->
                    <iotAcsCard v-for="(item) in  devicedata" :key="item.id" v-if="$route.path == '/iot_acs'"
                        :devicedata="item">
                    </iotAcsCard>
                    <iotCisCard v-for="(item) in  devicedata" :key="item.id" v-if="$route.path == '/iot_cis'"
                        :devicedata="item">
                    </iotCisCard>
                    <!-- 报警系统 -->
                    <iotIpsCard v-for="(item) in  devicedata" :key="item.id" v-if="$route.path == '/iot_ips'" :devicedata="item"></iotIpsCard>
                    <DmbCard v-for="(item) in  devicedata" :key="item.id" v-if="$route.path == '/iot_dmb'" :devicedata="item"></DmbCard>
                    <deviceCard
                        v-if="$route.path !='/iot_ba_ecs' && $route.path !='/iot_vscs' && $route.path != '/iot_acs' && $route.path != '/iot_ips' && $route.path != '/iot_cis' && $route.path != '/iot_dmb'"
                        v-for="(item) in  devicedata" :key="item.id" :devicedata="item" @readData="readData"
                        :IbmsDeviceReadDTO="IbmsDeviceReadDTO">
                    </deviceCard>
                </div>
                <!-- <slot name="device" ></slot> -->
            </div>
            <!-- </div> -->
        </div>

        <!-- 右边抽屉 -->
        <el-drawer title="设备绑点（点击新增）" :visible.sync="drawer" :direction="direction" :before-close="closeDrawer"
            class="drawer">
            <el-form :model="devSearch" :inline="true" label-width="80px" class="form_demo" size="small">
                <el-form-item label="系统" class="devForm">
                    <el-select v-model="subsystemCode" @change="changeSelect" placeholder="请选择系统" disabled>
                        <el-option v-for="item in subsystemList" :key="item.keyId" :label="item.systemType"
                            :value="item.keyId"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="设备名称">
                    <el-input @change="deviceNamechange" v-model="formSearch.name" clearable
                        @keyup.native.enter="getDevList('search')" />
                </el-form-item>
                <el-form-item label="设备IP">
                    <el-input @change="deviceIpchange" v-model="formSearch.ipAddress" clearable
                        @keyup.native.enter="getDevList('search')" v-show="subsystemCode == 'iot_acs'" />
                </el-form-item>
                <el-form-item>
                    <el-button @click="getDevList('search')">查询</el-button>
                </el-form-item>
                <el-form-item label="设备总数：" label-width="100px">
                    <span>{{deviceTotal}}</span>
                </el-form-item>
            </el-form>
            <div class="deviceList" v-if="devList">
                <div class="dev " v-for="(item) in devList" :key="Math.random()">
                    <!-- :class="{
                        'defaultSvg':true
                        }" -->
                    <span  :style="{
                        background:`url(${require('../../assets/iotImg/'+subsystemCode+'.png')}) no-repeat`,backgroundSize: `36px`,
                    }" @click="addPoint(item)" ></span>
                    <div>{{item.name}}</div>
                    <div v-show="subsystemCode == 'iot_acs'">{{item.ipAddress}}</div>
                </div>
                <el-pagination v-if="subsystemCode != 'iot_vscs'" @size-change="handleSizeChange"
                    @current-change="handleCurrentChange" :current-page="rightformSearch.current"
                    :page-sizes="[10, 20, 50, 100]" :page-size="rightformSearch.size"
                    layout="total, sizes, prev, pager, next, jumper" :total="deviceTotal" class="paging">
                </el-pagination>
                <el-pagination v-if="subsystemCode == 'iot_vscs'" background layout="total, prev, pager, next"
                    :page-size="10" :total="paging.total" @current-change="changePage"
                    style="margin-top: 10px;text-align: center">
                </el-pagination>
            </div>

        </el-drawer>
    </div>
</template>

<script>
    import point from './point.vue';
    import videojs from 'video.js';
    import deviceCard from './device_control_card.vue'
    import devicelistv from './device_list_v.vue'
    import diantiCard from './system_card_style/dianti_card.vue'
    import videomonitoringsystem from './system_card_style/video_monitoring_system.vue'
    import iotAcsCard from './system_card_style/iot_acs_card.vue'
    import iotCisCard from './system_card_style/iot_cis_card.vue'
    import iotIpsCard from './system_card_style/iot_ips_card.vue';//报警系统
    import DmbCard from './system_card_style/iot_dmb_small_card.vue'
    import iotAcsLog from './system_card_style/iot_acs_logs.vue'
    import iotAcsLogSearch from './system_card_style/iot_acs_log_search.vue'
    import iotCisLog from './system_card_style/iot_cis_logs.vue'
    import iotCisLogSearch from './system_card_style/iot_cis_log_search.vue'
    import iotCisLog2 from './system_card_style/iot_cis_logs2.vue'
    import iotCisLogSearch2 from './system_card_style/iot_cis_log_search2.vue'
    import iotSenseLog from './system_card_style/iot_sense_logs.vue'
    import iotSenseLogSearch from './system_card_style/iot_sense_log_search.vue'

    import {
        getCarDevs,
        commandread,
        commandwrite,
        sectionTree,
        xqSelectList,
        uploadFloorImg,
        systemList,
        getFloorImg,
        // getDeviceType,
        iotdevicepage,
        getPointBySecId,
        // getPointBySecId,
        getPointBySecIdState,
        getMonitorList,
        subsystemSection,
        getSensePointBySecId,
        getAcsSelect,
        JieShunEquipment,
        JieShunPersonnelInformation,
        getCisSelect,
        SynchronousSense,
        getMonitoringList,
        getTerminalsList,
        syncTerminalsEquipment
    } from '../../url/api';
    import { MessageBox } from 'element-ui';
    export default {
        props: [
            'drawer',
            'tableData',
            'review',
            'devSubsystem',
            'deviceBrand',
            'homePlay',
            'url',
            'getListFlag',
            'spaceType',
            'restore',
        ],
        data() {
            return {
                isfocus:0,
                paging: {
                    total: 0,
                    page: 1,
                    pageSize: 10,
                },
                pagePath: ["/iot_card", "/iot_parking", "/iot_video_monitor", "/iot_alarm", "/iot_fire_monitor", "/iot_broadcast", "/iot_device_2d"],
                deviceTotal: 0,
                spaceTypeMap: {
                    0: 'project',
                    1: 'section',
                    2: 'house',
                },
                deviceForm: {
                    current: 1,
                    size: 9999,
                },
                checkSectionValue: {},
                subsystemList: [],
                cameraInfo: { src: '', deviceName: '', dialogVisible: false },
                beforeDrag: true,
                imgW: 0, //图片宽高
                imgH: 0, //图片宽高
                moveX: 0, // 移动距离
                moveY: 0, // 移动距离
                chaX: 0, //差值
                chaY: 0, //差值
                startX: 0, //开始按下x坐标
                startY: 0, //开始按下y坐标
                zoom: .2, //缩放
                isDown: false, //是否按下
                doorSectionList: '',
                pointImg: '监控',
                building: '', //监控的区域id
                pointList: [],
                devSearch: {},
                subsystemCode: '', //
                drawerDevBrand: '', //抽屉 设备类型
                devList: [], //drawer里的绑定设备列表
                devList2: [], // drawer里的绑定设备列表  过滤的数据
                options: [], //楼栋
                devBrandList: [],
                fileList: [], //上传的图片列表
                uploadPath: '/api/v1.0/file/upload/file',
                viewType: 1, //判断空间展示 还是 列表展示
                uploadFlag: false,
                imgUrl: '',
                // imgUrl5:f5,
                sectionName: '',
                value: '',
                direction: 'rtl',
                defaultProps: {
                    children: 'children',
                    label: 'name',
                    value: 'id',
                },
                checked: [], // 存储选中节点的id
                formSearch: { xqId: '', current: 1, size: 9999 },
                formSearchspjk: {
                    xqId: '',
                    current: 1,
                    size: 10,
                },
                sectionId: '',
                xqSelect: [],
                sectionTree: [],
                checkedId: '',
                checkedSectionList: [],
                saveParams: { tsf: {} },
                bindPoint: { url: '' },
                defaultCheck: [],
                defaultExpand: [],
                cameraList: [],
                doorList: [],
                addDeviceBindList: [],
                alarmFrom: {
                    size: 9999,
                    current: 1,
                    devType: '',
                },
                systemItemType: 1,
                newSpaceType: '', // project section house
                devicedata: [],
                deviceDataList: [],
                deviceDataListState: [],
                IbmsDeviceReadDTO: [],
                DeviceViewData: [],
                timer: '',
                AdevSubsystemAA: '',
                cmdParameters: [],
                rightformSearch: {
                    current: 1,
                    size: 10,
                },
                previousRoute: '',
                checkedkeys: [],
                deg : 0,
                showLog:false,
                logType: '',
                cardshow:true,
            };
        },
        watch: {
            devList(val) {
                // console.log('drawer设备列表-----', val);
            },
            restore(val) {
                if (val) {
                    this.zoom = .2;
                    this.moveX = 0;
                    this.moveY = 0;
                    this.chaX = 0;
                    this.chaY = 0;
                }
            },
            /* 监听是否绑点成功  成功则删除绑点的图标 */
            review(val, oldVal) {
                // console.log('监听review', val);
                if (val) {
                    if (this.saveParams.list.length) {
                        this.saveParams.list.forEach((item, index) => {
                            let dom = document.querySelector('#myDom_' + index);
                            dom.remove();
                        });
                    }
                    this.saveParams.list = [];
                    this.addDeviceBindList = [];
                    // console.log("hahahhhahahahaha");
                    this.refreshPoint();
                }
            },
            url(val) {
                this.bindPoint.url = val;
            },
            getListFlag(val) {
                // console.log("QQQQQQQQQCCCCCCCCCCCCCCC");
                if (val) this.getPointList();
            },
            viewType(val) {
                if(val == 0) this.cardshow = false;
                console.log('viewType__________', val);
                // if (!val) this.viewType = 1;

                if (val != '3') {
                    if (this.timer) { //如果定时器还在运行 或者直接关闭，不用判断
                        clearInterval(this.timer); //关闭
                        // console.log("关闭定时器");
                    }
                } else {
                    let timedtask = true;//默认打开详情开始定时读数据任务，部分系统不需要（监控系统，门禁系统）
                    if (this.$route.path == '/iot_vscs') {//监控系统
                        timedtask = false;
                    } else if (this.$route.path == '/iot_acs') {//门禁
                        timedtask = false;
                    }
                    else if (this.$route.path == '/iot_ips') {//报警
                        timedtask = false;
                    }
                    // if (timedtask == true) {
                    //     this.timer = window.setInterval(() => {
                    //         setTimeout(() => {
                    //             this.ReadCommand()
                    //         }, 0);
                    //     }, 4000)
                    // }

                }
                this.saveParams.spaceType = val;
                // console.log("AAQWQWQWDQDDD");
                this.$emit('getData', this.saveParams);
                this.Bus.$emit('getData', true);

            },
            spaceType(val) {
                this.viewType = val;
            },
            devSubsystem(val) {
                this.formSearchspjk = {
                    xqId: '',
                    current: 1,
                    size: 10,
                }
                this.rightformSearch = {
                    current: 1,
                    size: 10,
                }
                //
                this.AdevSubsystemAA = val
                if (this.xqSelect.length > 0) {
                    // console.log("QQQQQQQQQQQQQQQQBBBBBBBBBBBBB",val);
                    this.subsystemCode = val;
                    // console.log(this.xqSelect);
                    // let id = this.xqSelect[0].id;
                    // this.formSearch.xqId = id;
                    // this.saveParams.xqId = id;
                    //
                    // if (val != 'iot_vscs') {
                        this.getDevList();
                    // } else if (val == 'iot_vscs') {//监控系统
                    //     this.formSearchspjk.xqId = this.formSearch.xqId;
                    //     let params = this.formSearchspjk;
                    //     getMonitorList(params).then((resp) => {

                    //         this.devList = resp.data.data.records;
                    //         this.paging.total = resp.data.data.total;
                    //         // this.paging.total = resp.data.data.total;
                    //     })
                    //     console.log(val, this.devList, "QQQQQQQQQQQQ");
                    // }
                    // 
                    // console.log(this.checkSectionValue);
                    if (this.checkSectionValue.id) {
                        this.refreshPoint();
                    }

                }

            },
            "$route"(val) {
                if (this.$route.path && this.$route.path != '/iot_device_2d') {
                    // if (this.$route.path != '' && this.$route.path != undefined && this.$route.path != '/iot_device_2d') {
                    // Object.assign(this.$data, this.$options.data())
                    // $forceUpdate();
                    this.AdevSubsystemAA = this.$route.path.replace('/', '');
                    // console.log("QQQQQQQQQQQQQQ", this.AdevSubsystemAA);
                    let id = this.xqSelect[0].id;
                    this.formSearch.xqId = id;
                    this.saveParams.xqId = id;
                    if (this.sectionTree.length > 0) {
                        this.sectionId = this.sectionTree[0].id;
                        this.getImg({
                            spaceId: this.sectionId,
                            spaceType:
                                this.spaceTypeMap[
                                `${this.sectionTree[0].type}`
                                ],
                            subsystem: this.AdevSubsystemAA,
                        });
                    }
                    this.viewType = 1
                    // console.log(this.cardshow);
                    this.cardshow = true
                    // this.getDevList();
                    // 
                    this.refreshPoint();

                    // 
                    this.changeProject(id)
                    // console.log('展示类型——————————', this.viewType);


                }

            },
            // "$route"(val){
            //         console.log(val,"EEEEEEEEEE");
            //         let id = this.xqSelect[0].id;
            //                 this.formSearch.xqId = id;
            //                 this.saveParams.xqId = id;
            //                 // this.getDevList();
            //                 // console.log('小区下拉列表', this.xqSelect);
            //                 this.changeProject(id);
            // },

        },
        methods: {
            changeLogType(type) {
                if(type == 'state'){
                    this.isfocus = 1
                }else{
                    this.isfocus = 2
                }
              this.cardshow = false;
              this.viewType = 7;
              this.logType = type; 
            },
            handleSizeChange(val) {
                this.rightformSearch.size = val;
                this.getDevList();
            },
            handleCurrentChange(val) {
                this.rightformSearch.current = val;
                this.getDevList();
            },
            changePage(page) {
                this.paging.page = page;
                this.formSearchspjk.current = page;
                this.getTableData();
                // this.$emit('changePageNum', page);
            },
            getTableData() {
                this.formSearchspjk.xqId = this.formSearch.xqId
                this.formSearchspjk.cameraName=this.formSearch.name,
                getMonitoringList(this.formSearchspjk).then((res) => {
                    // let res = JSON.parse(resp.data.data).data
                        // console.log("监控设备列表");
                        this.devList = res.data.data.list.map(item => {
                            item.transportProtocol = 'rtsp';
                            return item;
                        });
                        this.paging.total = res.data.data.total;
                })
                // console.log(JSONDATA)
                // this.tableData = JSONDATA.data.records;
            },
            deviceNamechange(val) {
                this.formSearch.name = val
            },
            deviceIpchange(val){
                this.formSearch.ipAddress = val
            },
            readData() {
                // this.ReadCommand()
                console.log(1111);
            },
            // ReadCommand() {
            //     // new Promise((resolve, reject) => {
            //     if (this.IbmsDeviceReadDTO.length > 0) {
            //         let params = this.IbmsDeviceReadDTO;
            //         commandread(params).then((res) => {
            //             if (res.data.ok) {
            //                 this.DeviceViewData = res.data.data
            //                 // console.log("QQQQQQQQ", this.DeviceViewData, "实时更新点位数据");
            //                 // resolve('session message')
            //                 //实时更新点位数据
            //                 this.devicedata = this.DeviceViewData

            //                 // if (this.IbmsDeviceReadDTO.length > 0) {
            //                 //     this.devicedata = this.DeviceViewData
            //                 // } else {
            //                 //     this.devicedata = []
            //                 // }
            //                 // console.log(this.IbmsDeviceReadDTO, "OOOOOOOOOOAA");

            //                 // console.log("设备展示数据：", this.DeviceViewData);
            //             }
            //         });
            //     }

            // },
            getEquipment(){
                MessageBox.confirm('确定要同门禁设备吗？', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
                }).then(() => {
                    let params = {}
                JieShunEquipment(params).then((res)=>{
                    if(res.data.ok){
                        this.$message({
                                message: res.data.message,
                                type: 'success'
                            });
                    }
                })
                }).catch(() => {
                });
                
            },
            setSense(){
                MessageBox.confirm('确定要同烟感设备吗？', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
                }).then(() => {
                    SynchronousSense(this.formSearch.xqId).then((res)=>{
                    if(res.data.ok){
                        this.$message({
                                message: res.data.message,
                                type: 'success'
                            });
                    }
                })
                }).catch(() => {
                });
            },
            getPersonnelInformation(){
                MessageBox.confirm('确定要同门禁人员吗？', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
                }).then(() => {
                    let params = {}
                JieShunPersonnelInformation(params).then((res)=>{
                    if(res.data.ok){
                        this.$message({
                                message: res.data.message,
                                type: 'success'
                            });
                    }
                })
                }).catch(() => {
                });
            },
            getsyncTerminalsEquipment(){
                MessageBox.confirm('确定要同步广播设备的描述信息吗？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                    }).then(() => {
                        let params = {}
                        syncTerminalsEquipment(params).then((res)=>{
                        if(res.data.ok){
                            this.$message({
                                    message: res.data.message,
                                    type: 'success'
                                });
                        }
                    })
                    }).catch(() => {
                    });
                },

            delPointList(obj) {
                this.pointList = this.pointList.filter(
                    (item) => item.deviceId !== obj.deviceId
                );
                this.saveParams.pointList = this.pointList;
                // //
                this.$emit('getData', this.saveParams);
            },
            handleClose(done) {
                this.cameraInfo.src = '';
                this.cameraInfo.deviceName = '';
                // videojs('my_video').dispose();
                this.cameraInfo.dialogVisible = false;
                done();
            },
            getCameraInfo(val) {
                let { src, deviceName, dialogVisible } = val;
                this.cameraInfo.src = src;
                this.cameraInfo.deviceName = deviceName;
                this.cameraInfo.dialogVisible = dialogVisible;
                this.myPlay(src);
            },
            getNewpoint(val){
                this.$emit('getNewpoint', val);
            },
            myPlay(src) {
                this.$nextTick(() => {
                    let dom = document.getElementById('my_video');
                    videojs(dom).src([
                        {
                            src: src,
                            type: 'application/x-mpegURL',
                        },
                    ]);
                    videojs(dom, { autoplay: true }, function () {
                        this.play();
                    });
                });
            },
            //根据名称获取系统类型
            getSystemType(name) {
                let str = [
                    '',
                    '监控',
                    '门禁',
                    '停车场',
                    '安防报警-公区',
                    '安防报警-室内',
                    '火灾报警',
                ];
                return str.indexOf(name);
            },
            //拖拽结束
            dragEnd(e) {
                this.isDown = false;
                this.moveX = this.chaX;
                this.moveY = this.chaY;
                this.saveParams.tsf = {
                    zoom: this.zoom,
                    chaX: this.chaX,
                    chaY: this.chaY,
                };
                // console.log(this.saveParams,"WWWWWWWWWWWWWW");
                // this.$emit('getData', this.saveParams);
            },
            //拖拽开始
            dragStart(e) {
                // console.log('距离左侧：', e.offsetX, '距离上侧：', e.offsetY);
                // console.log('距离左侧：',e.offsetX,'距离上侧：',e.offsetY)

                this.startX = e.clientX;
                this.startY = e.clientY;
                this.isDown = true;

                // let domList = document.querySelectorAll('.mark');
                // domList.forEach((item) => {
                //     item.style.left = item.style.left.replace('px','') + this.chaX + 'px';
                //     item.style.top = item.style.top.replace('px','') + this.chaY + 'px';
                // });
            },
            //拖拽完成
            dragOver(e) {
                this.isDown = false;
            },
            getNum(n) {
                return n - n * 2;
            },
            moveImg(e) {
                if (!this.isDown) return;
                this.chaX = this.moveX + e.clientX - this.startX;
                this.chaY = this.moveY + e.clientY - this.startY;
                // this.chaX = (this.moveX + e.clientX - this.startX)*0.5;
                // this.chaY = (this.moveY + e.clientY - this.startY)*0.5;
            },
            rollFunc() {
                let e = this.$refs.cad;
                // 
                if ( this.zoom >= 0.1) {
                    e.style.transform = `translate(0%, 0%) scale(${ this.zoom}) rotate(${this.deg}deg)`;
                } else {
                     this.zoom = 0.1;
                    e.style.transform = `translate(0%, 0%) scale(${ this.zoom}) rotate(${this.deg}deg)`;
                    return false;
                }
            },
            //底图缩放
            zoomImg(e) {
                e = e || event;
                // 
                // console.log(this.zoom, "缩放值");
                // let imgDom = document.querySelector('#cadImg');
                let direction = e.deltaY > 0 ? 'down' : 'up';
                if (direction === 'up') {
                    if (this.zoom > 1.5) return;
                    this.zoom += 0.02;
                } else {
                    if (this.zoom < .2) return;
                    this.zoom -= 0.02;
                }
                // this.rollFunc();
                this.computerPointPosition();
                this.saveParams.list = this.addDeviceBindList;
                this.$set(this.saveParams.tsf, 'zoom', this.zoom);
                this.$emit('getData', this.saveParams);
            },
            computerPointPosition() {
                let domList = document.querySelectorAll('.mark');
                domList.forEach((item) => {
                    // item.style.left =
                    let left = +item.style.left.replace('px', '');
                    let top = +item.style.top.replace('px', '');
                    item.style.left = left * this.zoom;
                    item.style.top = top * this.zoom;
                });
                this.addDeviceBindList = this.addDeviceBindList.map(
                    (item, index) => {
                        // console.log('zoom', domList[index]);
                        let left = domList[index].style.left.replace('px', '');
                        let top = domList[index].style.top.replace('px', '');
                        item.x = +left;
                        item.y = +top;
                        return item;
                    }
                );
            },
            positionZoom(zoom) {
                // zoom = 2 - zoom;
                let domList = document.querySelectorAll('.mark');
                domList.forEach((item) => {
                    item.setAttribute('zoom', zoom.toFixed(1));

                    let left = item.getAttribute('moveX');
                    let top = item.getAttribute('moveY');

                    let xx = item.getAttribute('chaX');
                    let yy = item.getAttribute('chaY');

                    let flag = null;
                    if (zoom > 1) {
                        flag = true;
                        zoom = (zoom - 1).toFixed(1);
                    } else {
                        flag = false;
                        zoom = (1 - zoom).toFixed(1);
                    }
                    let n1 = Math.round(Math.abs(zoom * left));
                    let n2 = Math.round(Math.abs(zoom * top));
                    let n3 = Math.round(Math.abs(zoom * xx));
                    let n4 = Math.round(Math.abs(zoom * yy));
                    if (flag) {
                        // console.log('----------------------');
                        item.style.left = +left + +n1 + +n3 + 'px';
                        item.style.top = +top + +n2 + +n4 + 'px';
                    } else {
                        // console.log('----------------------');
                        item.style.left = +left - +n1 - +n3 + 'px';
                        item.style.top = +top - +n2 - +n4 + 'px';
                    }
                    console.log(item.style.left, item.style.top);
                });
            },
            // 单选区域  并且获取底图 & 回显点位数据
            changeRadio(data) {
                // console.log(this.sectionId);
                this.cardshow = true
                if(this.$route.path == '/iot_cps'){
                    // this.viewType = 2
                    this.viewType = 0
                }else{
                    this.viewType = 1
                }
                this.saveParams.sectionId = data.id;
                this.saveParams.xqId = this.formSearch.xqId;
                let spaceType = this.spaceTypeMap;
                this.newSpaceType = spaceType[`${data.type}`];
                this.chaX = 0;
                this.chaY = 0;
                this.moveX = 0;
                this.moveY = 0;
                this.zoom = .2;
                let obj = {
                    spaceType: spaceType[`${data.type}`],
                    spaceId: data.id,
                    subsystem:
                        this.$route.path == '/iot_device_2d'
                            ? this.subsystemCode
                            : this.$route.path.replace('/', ''),
                };
                // 
                // if (!obj.subsystem.includes('ba') && this.$route.path !== '/iot_device_2d') {
                //     obj.subsystem = this.$store.state.basicSystem[obj.subsystem];
                // }

                this.checkSectionValue = data;
                this.saveParams.spaceData = obj;
                this.saveParams.checkSectionValue = data;
                this.$emit('getData', this.saveParams);
                this.getImg(obj, false);
                // console.log(param,"QQQQQQQQQQQQQQQQAAAAAAAAAAAAAA");
                this.refreshPoint();
            },
            // 刷新点位数据
            refreshPoint() {
                // console.log("aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa");
                this.$nextTick(() => {
                    let path = this.$route.path.replace('/', '');
                    let loading = this.$loading({ target: '#drawerDevList' });
                    let param = {
                        projectId: this.formSearch.xqId,
                        spaceId: this.checkSectionValue.id,
                        spaceType:
                            this.spaceTypeMap[`${this.checkSectionValue.type}`],
                        subsystem: this.AdevSubsystemAA,
                        // subsystem:this.subsystemCode
                    };
                    //
                    // console.log("SSSSSSSSSSSSSSSSSS", this.AdevSubsystemAA);
                    // console.log(param,"QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ");
                    if (path != 'iot_device_2d') {
                        param.subsystem = this.$route.path.replace('/', '');
                    }
                    getPointBySecId(param).then((res) => {
                        if (res.data.ok) {
                            this.pointList = res.data.data;
                            this.saveParams.pointList = this.pointList;
                            this.deviceDataList = res.data.data;
                            console.log('heressssssssss',this.deviceDataList);
                            this.devicedata = this.deviceDataList;
                            this.IbmsDeviceReadDTO = this.deviceDataList;
                            // console.log("AAAAAAAAAAAAAAAAAAAAAAAAAAAAA", this.IbmsDeviceReadDTO);
                            // this.cmdParameters = []
                            // let readDeviceDTO
                            // console.log('deviceDataList ====================', this.deviceDataList);
                            // this.deviceDataList.forEach(val => {

                            //     if (val.devicePoints != null) {
                            //         if (val.devicePoints.length > 0) {
                            //             val.devicePoints.forEach(item => {
                            //                 let readDeviceDTO = {
                            //                     deviceId: '',
                            //                     pointId: '',
                            //                 }
                            //                 readDeviceDTO.deviceId = val.deviceId;
                            //                 readDeviceDTO.pointId = item.pointId;
                            //                 this.cmdParameters.push(readDeviceDTO);
                            //             })
                            //         }
                            //     }

                            // });
                            // console.log(this.cmdParameters,"封装读数据");
                            loading.close();
                            // this.ReadCommand()
                            sessionStorage.setItem('devicedata', JSON.stringify(this.devicedata))
                        }
                    });
                    getPointBySecIdState(param).then((res) => {
                        if (res.data.ok) {
                            this.deviceDataListState = res.data.data;
                            // this.saveParams.pointList = this.pointList;
                            // this.deviceDataList = res.data.data;
                            // this.devicedata = this.deviceDataList;
                            // this.IbmsDeviceReadDTO = this.deviceDataList;
                            // loading.close();
                            // // this.ReadCommand()
                            // sessionStorage.setItem('devicedata', JSON.stringify(this.devicedata))
                        }
                    })

                });
            },
            /* 选择系统   */
            changeSelect(code) {
                this.getDevList(code);
                this.saveParams.subsystemCode = code;
                this.$emit('getData', this.saveParams);
            },
            //获取设备品牌   根据设备系统
            // getDeviceBrand(type) {
            //     getDeviceType({ type }).then((res) => {
            //         if (res.data.ok) {
            //             this.devBrandList = res.data.data;
            //             this.drawerDevBrand = this.devBrandList[0];
            //         }
            //     });
            // },
            //添加点位
            addPoint(dev) {
                if (this.addDeviceBindList.some(item => item.id === dev.id)) {
                    this.$message('该点位已在底图上');
                    return;
                }

                dev.AdevSubsystemAA = this.subsystemCode;
                dev.deviceType = this.drawerDevBrand.deviceType;
                dev.cameraCode = this.building;
                let bg = require('../../assets/iotImg/'+dev.AdevSubsystemAA+'.png');//require('../../assets/images/defaultDev.png');
                dev.bg = bg;
                dev.x = 0;
                dev.y = 0;
                this.addDeviceBindList.push(dev);
                //子系统唯一标识绑点数据
                // debugger
                if (dev.AdevSubsystemAA == "iot_vscs") {
                    dev.extra = dev.extra;
                    dev.deviceId = dev.channelNo;
                } else if (dev.AdevSubsystemAA == "iot_cps") {
                    dev.deviceId = dev.devId;
                } else {
                    dev.extra = "";
                }
                this.saveParams.list = this.addDeviceBindList;

                // console.log('点击添加图标数据', dev);
                // console.log('点击图添加', this.subsystemCode);

                // 底图
                // let dom = document.querySelector('#cadImg');
                let dom = this.$refs.img;
                this.saveParams.list.map((item, index) => {
                    if (!document.getElementById('myDom_' + index)) {
                        let aDom = document.createElement('span');

                        let textNode = document.createTextNode(dev.name);
                        // 创建一个 span 元素作为文本容器
                        let textContainer = document.createElement("span");
                        textContainer.style.position = "absolute"; // 设置为绝对定位
                        textContainer.style.top = "100%"; // 相对于父元素底部定位
                        textContainer.style.left = "50%"; // 居中对齐
                        textContainer.style.transform = "translateX(-50%)"; // 平移使得文字居中
                        textContainer.style.textAlign = "center"; // 文本居中
                        textContainer.appendChild(textNode); // 将文本节点添加到 span 元素中
                        // 将文本容器添加到 aDom 中
                        aDom.appendChild(textContainer);


                        aDom.className = 'mark';
                        aDom.style.display = 'inline-block';
                        aDom.style.zIndex = '999';
                        aDom.style.width = 72 + 'px';
                        aDom.style.height = 91 + 'px';
                        aDom.style.cursor = 'move';
                        aDom.id = dev.id;
                        aDom.style.position = 'absolute';
                        aDom.style.left =
                            72 * index + +this.getNum(this.chaX) / this.zoom + 'px';
                        aDom.style.top = this.getNum(this.chaY) / this.zoom + 'px';
                        aDom.style.background = `url(${bg}) no-repeat`;
                        aDom.style.backgroundSize = 'cover';
                        aDom.setAttribute('moveX', 0);
                        aDom.setAttribute('moveY', 0);
                        // aDom.setAttribute('zoom', this.zoom.toFixed(1));
                        if (this.chaX == 0 && this.chaY == 0) {
                            aDom.setAttribute('translateFlag', true);
                        } else {
                            aDom.setAttribute('chaX', this.chaX);
                            aDom.setAttribute('chaY', this.chaY);
                            aDom.setAttribute('translateFlag', false);
                        }
                        aDom.addEventListener('mousedown', this.move, true);
                        aDom.addEventListener(
                            'dblclick',
                            this.removeDom
                            // this.removeDom(aDom)
                        );
                        dom.appendChild(aDom);
                        aDom.id = 'myDom_' + index;
                        aDom.deviceId = dev.deviceId;
                        item.id = 'myDom_' + index;
                    }
                });
                // this.closeDrawer();
                this.saveParams.tsf = {
                    zoom: this.zoom,
                    chaX: this.chaX,
                    chaY: this.chaY,
                };
                this.$emit('getData', this.saveParams);
            },
            /* 底图上传成功执行 */
            handleSuccess(resp, file, fileList) {
                this.fileList = [];
                if (resp.ok) {
                    // let obj = this.localVal; //点击的房间或区域对象

                    if (!this.sectionId) {
                        this.$message.error('请选择区域后上传图片');
                        return;
                    }
                    let arr = this.subsystemList.map((item) => item.keyId);
                    uploadFloorImg({
                        projectId: this.formSearch.xqId,
                        mapUrl: resp.data[0],
                        spaceId: this.sectionId,
                        spaceType: this.newSpaceType,
                        subsystems: arr,
                    }).then((res) => {
                        if (res.data.ok) {
                            this.$message({
                                type: 'success',
                                message: resp.msg,
                            });
                            // console.log('common_782_', this.AdevSubsystemAA);
                            this.getImg({
                                spaceId: this.sectionId,
                                subsystem: this.AdevSubsystemAA,
                                spaceType: this.newSpaceType,
                                // deviceType: this.deviceBrand,
                            });
                        }
                    });
                }
            },
            /* 判断是否超过文件数量 */
            handleExceed(files, fileList) {
                this.$message.warning(
                    `当前限制选择 3 个文件，本次选择了 ${files.length
                    } 个文件，共选择了 ${files.length + fileList.length} 个文件`
                );
            },
            beforeUpload() {
                if (!this.sectionId) {
                    this.$message.warning('请先选择区域后上传');
                }
            },
            //关闭抽屉
            closeDrawer() {
                this.$emit('closeDrawer', false);
            },
            //删除点位
            removeDom(e) {
                this.$confirm('此操作将删除该点位, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                })
                    .then(() => {
                        let id = e.target.id;
                        let index = -1;
                        e.target.parentNode.removeChild(e.target);
                        this.addDeviceBindList.forEach((item, ind) => {
                            if (item.id == id) {
                                index = ind;
                            }
                        });
                        this.addDeviceBindList.splice(index, 1);
                        this.$message({
                            type: 'success',
                            message: '删除成功!',
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消删除',
                        });
                    });
            },
            // 移动点位
            move(e) {
                e = e || event;
                let odiv = e.target;
                let ind = this.getDomIndex(odiv);
                if (ind <= -1) return;
                let mvDom = this.saveParams.list[ind];
                //算出鼠标相对元素的位置
                // let domW = odiv.offsetWidth;
                // let domH = odiv.offsetHeight;
                // if (odiv.parentNode.id != 'cadImg') return;
                let that = this;
                var oId = e.target.id;
                odiv.onmousedown = (e) => {
                    e.preventDefault();
                    //鼠标距离点位的距离
                    let disX = e.clientX - odiv.offsetLeft * this.zoom;
                    let disY = e.clientY - odiv.offsetTop * this.zoom;
                    document.onmousemove = (e) => {
                        e.preventDefault();
                        let left = (e.clientX - disX) / this.zoom;
                        let top = (e.clientY - disY) / this.zoom;
                        //限制拖动范围
                        // let left = e.clientX - disX < 0 ? 0 : e.clientX - disX;
                        // let top = e.clientY - disY < 0 ? 0 : e.clientY - disY;
                        // left = left > divW ? divW : left;

                        //移动当前元素
                        odiv.style.left = left + 'px';
                        odiv.style.top = top + 'px';

                        document.onmouseup = () => {
                            mvDom.x = left;
                            mvDom.y = top;
                            odiv.setAttribute('moveX', left);
                            odiv.setAttribute('moveY', top);
                            this.addDeviceBindList = this.addDeviceBindList.map(
                                (item) => {
                                    if (item.id == oId) {
                                        item.x = left;
                                        item.y = top;
                                    }
                                    return item;
                                }
                            );

                            mvDom.deviceType = this.subsystemCode;
                            that.saveParams.xqId = this.formSearch.xqId;
                            that.saveParams.sectionId = this.sectionId;
                            that.saveParams.cameraCode = this.building;
                            mvDom.cameraCode = this.building;
                            mvDom.deviceBrand = this.drawerDevBrand.deviceType;
                            // if (left == divW) {
                            //     odiv.remove();
                            // }
                            that.saveParams.pointList = this.pointList;
                            that.$emit('getData', that.saveParams);
                            document.onmousemove = null;
                            document.onmousedown = null;
                        };
                    };
                };
                e.preventDefault();
            },
            getDomIndex(dom) {
                let arr = this.saveParams.list;
                for (var i = 0; i < arr.length; i++) {
                    if (arr[i].id == dom.id) return i;
                }
                return -1;
            },
            changeProject(id) {
                if (this.$route.path == '/iot_device_2d') {
                    sectionTree([id]).then((res) => {
                        if (res.data.ok) {
                            this.sectionTree = res.data.data;
                            this.sectionId = this.sectionTree[0].id;
                            this.checkSectionValue = this.sectionTree[0];
                            // console.log(this.sectionTree[0], "BBBBBBBBBBBBBBBBB");
                            setTimeout(() => {
                                let subsystem = '';
                                if (this.$route.path == '/iot_device_2d') {
                                    subsystem = this.AdevSubsystemAA;
                                } else {
                                    subsystem = this.$route.path.replace('/', '');
                                }
                                // console.log('初始化项目列表', subsystem);
                                this.getImg({
                                    spaceId: this.sectionId,
                                    spaceType:
                                        this.spaceTypeMap[
                                        `${this.sectionTree[0].type}`
                                        ],
                                    subsystem,
                                });
                                this.saveParams.checkSectionValue =
                                    this.checkSectionValue;
                                this.saveParams.sectionId = this.sectionId;
                                this.saveParams.xqId = id;
                                this.$emit('getData', this.saveParams);
                                this.refreshPoint();
                                this.getDevList();
                            }, 200);
                        }
                    });
                } else {
                    let subsystem = '';
                    if (this.$route.path == '/iot_device_2d') {
                        subsystem = this.AdevSubsystemAA;
                    } else {
                        subsystem = this.$route.path.replace('/', '');
                    }
                    subsystemSection({ projectId: id, subsystemCode: subsystem }).then((res) => {
                        if (res.data.ok) {
                            this.sectionTree = res.data.data;
                            this.sectionId = this.sectionTree[0].id;
                            this.checkSectionValue = this.sectionTree[0];
                            // console.log(this.sectionTree[0], "BBBBBBBBBBBBBBBBB");
                            setTimeout(() => {

                                // console.log('初始化项目列表', subsystem);
                                this.getImg({
                                    spaceId: this.sectionId,
                                    spaceType:
                                        this.spaceTypeMap[
                                        `${this.sectionTree[0].type}`
                                        ],
                                    subsystem,
                                });
                                this.saveParams.checkSectionValue =
                                    this.checkSectionValue;
                                this.saveParams.sectionId = this.sectionId;
                                this.saveParams.xqId = id;
                                this.$emit('getData', this.saveParams);
                                this.refreshPoint();
                                // this.getDevList();-
                            }, 200);
                        }
                    });
                }
            },
            /** 
             *  @param params:{spaceId：区域id，spaceType：区域类型，subsystem：子系统编号}
             *  @param flag true:获取设备列表  false:不获取
             * */
            getImg(params, flag = true) {
                getFloorImg(params).then((res) => {
                    if (res.data.ok) {
                        // console.log('layout获取图片', res);
                        let data = res.data.data;
                        this.$nextTick(() => {
                            if (data) {
                                this.bindPoint.url = data;
                                let dom = document.querySelector('#cadImg img');
                                this.imgW = dom.offsetWidth;
                                this.imgH = dom.offsetHeight;
                                this.saveParams.imgW = this.imgW;
                                this.saveParams.imgH = this.imgH;
                                this.saveParams.addDevFlag = true;
                                this.uploadFlag = false;
                                if (flag) {
                                    this.getPointList();
                                }
                            } else {
                                this.saveParams.addDevFlag = false;
                                this.$set(this.bindPoint, 'url', '');
                                this.uploadFlag = true;
                                this.pointList = [];
                            }
                            this.$emit('getData', this.saveParams);
                            // this.$forceUpdate();
                        });
                    }
                });
            },
            // 获取设备点位
            getPointList() {
                this.refreshPoint();
            },
            init() {
                systemList({}).then((res) => {
                    if (res.data.ok) {
                        this.subsystemList = res.data.data;
                        this.subsystemCode = this.subsystemList[0].keyId;
                        // 
                        if(!this.previousRoute){
                            this.previousRoute = this.$route.query.routers
                        }
                        if (this.previousRoute == '/iot_alarm' || this.previousRoute == '/iot_ibms_visualization') {
                            if (this.$route.query && this.$route.query.rowData != undefined) {
                                let alertData = this.$route.query.rowData;
                                // console.log(alertData, "报警参数AQQQQQQQQQQQQQQQQQQQQ");
                                this.subsystemCode = alertData.subsystem;
                            }
                        }
                        // //
                        this.saveParams.subsystemList = this.subsystemList;
                    }
                });
                xqSelectList({})
                    .then((res) => {
                        // //
                        // console.log("AAAAAAAAAAAA", res);
                        if (res.data.ok) {
                            this.xqSelect = res.data.data;
                            let id = this.xqSelect[0].id;
                            if (this.previousRoute == '/iot_alarm' || this.previousRoute == '/iot_ibms_visualization') {
                                if (this.$route.query && this.$route.query.rowData != undefined) {
                                    let alertData = this.$route.query.rowData;
                                    // console.log(alertData, "报警参数AQQQQQQQQQQQQQQQQQQQQ");
                                    id = alertData.projectId;
                                    // this.alarmLocation(alertData);
                                }
                                // else{
                                //     this.changeProject(id);
                                // }
                            }
                            this.formSearch.xqId = id;
                            this.saveParams.xqId = id;
                            // this.getDevList();
                            // console.log('小区下拉列表', this.xqSelect);

                            // this.changeProject(id);
                            if (this.$route.path == '/iot_device_2d') {
                                return sectionTree([id]);
                            } else {
                                let subsystem = this.$route.path.replace('/', '');
                                return subsystemSection({ projectId: id, subsystemCode: subsystem })
                            }
                            // 
                            //===============报警跳转===============

                            // return sectionTree([id]);
                        }
                    })
                    .then((res) => {
                        if (res.data.ok) {
                            this.sectionTree = res.data.data;
                            this.sectionId = this.sectionTree[0].id;
                            this.saveParams.sectionId = this.sectionId;
                            this.defaultCheck = [this.sectionTree[0].id];
                            this.checkSectionValue = this.sectionTree[0];
                            this.defaultSpaceType =
                                this.spaceTypeMap[`${res.data.data[0].type}`];
                            this.defaultExpand = [this.sectionTree[0].id];
                            // console.log(
                            //     'init中section_tree_success',
                            //     this.AdevSubsystemAA
                            // );
                            this.saveParams.checkSectionValue = this.sectionTree[0];
                            if (this.previousRoute == '/iot_alarm' || this.previousRoute == '/iot_ibms_visualization') {
                                if (this.$route.query && this.$route.query.rowData != undefined) {
                                    let alertData = this.$route.query.rowData;
                                    console.log(alertData, "报警参数AQQQQQQQQQQQQQQQQQQQQ");
                                    // id = alertData.projectId;
                                    this.alarmLocation(alertData);
                                } else {
                                    this.changeProject(id);
                                }
                            }
                            // this.getDevList();
                            // 测试默认跳转位置--需要传入节点data
                            this.changeRadio(this.sectionTree[0])
                            // this.$emit('getData', this.saveParams);
                        }
                    });

                // this.$emit('getData', this.saveParams);
            },
            getDevList(code) {
                // let loading = this.$loading({ target: '#drawerDevList' });
                let val = JSON.parse(JSON.stringify(this.checkSectionValue));
                let obj = {
                    projectId: this.formSearch.xqId,
                    sectionId: val.id,
                    // spaceType: this.spaceTypeMap[`${val.type}`],
                    systemType: this.subsystemList.find(item => item.keyId == this.subsystemCode).systemType,
                };
                let params = Object.assign(this.rightformSearch, obj);
                // console.log('获取设备参数', params);
                // if (this.formSearch.name) {
                params.name = this.formSearch.name;
                if(code == 'search'){
                    console.log('在查询');
                    params.current = 1
                    this.formSearchspjk.current = 1
                }
                // }
                //
                if (this.subsystemCode == 'iot_vscs') {//视频监控
                    this.formSearchspjk.xqId = this.formSearch.xqId;
                    this.formSearchspjk.selectName = this.formSearch.name;
                    let params1 = this.formSearchspjk;
                    getMonitoringList(params1).then((res) => {
                        console.log('here.............',res);
                        // let res = JSON.parse(resp.data.data).data
                        // console.log("监控设备列表");
                        this.devList = res.data.data.list.map(item => {
                            item.transportProtocol = 'rtsp';
                            return item;
                        });
                        this.paging.total = res.data.data.total;
                        this.deviceTotal = res.data.data.total;
                    })
                    // loading.close();
                    console.log(val, this.devList, "QQQQQQQQQQQQ");
                } else //烟感
                if (this.subsystemCode == 'iot_sense') {
                    let params3 = {
                        current: params.current,
                        name: params.name,
                        // projectId: params.projectId,
                        size: params.size
                    }
                    getSensePointBySecId(params3)
                    .then((res)=>{
                        console.log(res);
                        if (res.data.ok) {
                                this.devList = res.data.data.records.map((item) => {
                                    item.deviceId = item.id;
                                    return item;
                                });
                                this.deviceTotal = res.data.data.total;
                            }
                    })
                }else
                if (this.subsystemCode == 'iot_acs') { //门禁
                    let params3 = {
                        current: params.current,
                        size: params.size,
                        name: params.name,
                        ipAddress:this.formSearch.ipAddress,
                        projectId: params.projectId,
                    }
                    getAcsSelect(params3)
                    .then((res)=>{
                        console.log(res);
                        if (res.data.ok) {
                                this.devList = res.data.data.records.map((item) => {
                                    item.deviceId = item.id;
                                    return item;
                                });
                                this.deviceTotal = res.data.data.total;
                            }
                    })
                }else
                if (this.subsystemCode == 'iot_cis') { //安居宝对讲
                    let params3 = {
                        current: params.current,
                        projectId: this.formSearch.xqId,
                        size: params.size,
                        name: params.name,
                    }
                    getCisSelect(params3)
                    .then((res)=>{
                        console.log(res);
                        if (res.data.ok) {
                                this.devList = res.data.data.records.map((item) => {
                                    item.deviceId = item.id;
                                    return item;
                                });
                                this.deviceTotal = res.data.data.total;
                            }
                    })
                }else
                if (this.subsystemCode == 'iot_cps') {//停车场
                    // 
                    let params2 = {
                        current: params.current,
                        name: params.name,
                        projectId: params.projectId,
                        size: params.size
                    }
                    getCarDevs(params2)
                        .then((res) => {
                            if (res.data.ok) {
                                // console.log('获取停车场设备列表', res.data.data.records);              
                                this.devList = res.data.data.records.map((item) => {
                                    item.deviceId = item.id;
                                    return item;
                                });
                                this.deviceTotal = res.data.data.total;
                            }
                            // loading.close();
                        })
                        .catch((err) =>
                            console.log(err)
                        );
                } else
                    if (this.subsystemCode == "iot_dmb") {
                        //广播系统
                        let params2 = {
                        current: params.current,
                        size: params.size,
                        endpointName: params.name,
                        // projectId: params.projectId,
                        };
                        getTerminalsList(params2)
                        .then(res => {
                            if (res.data.ok) {
                            console.log(res);
                            this.devList = res.data.data.records.map((item) => {
                                    item.deviceId = item.endpointId;
                                    item.name = item.endpointName;
                                    return item;
                                });
                                this.deviceTotal = res.data.data.total;
                            }
                        })
                        .catch(err => console.log(err));
                    } else  {
                    console.log(params);
                    iotdevicepage(params)
                        .then((res) => {
                            if (res.data.ok) {
                                // console.log('获取绑定设备列表', res.data.data.records);
                                this.devList = res.data.data.records.map((item) => {
                                    item.deviceId = item.id;
                                    return item;
                                });
                                this.deviceTotal = res.data.data.total;
                            }
                            // loading.close();
                        })
                        .catch((err) =>
                            console.log(err)
                        );
                }

            },
            getPreviousRoute(from) {
                // console.log(from, "wwwwwwwwwwwwwwwwwwww");
                this.previousRoute = from.path
            },
            alarmLocation(alertData) {
                this.$nextTick(() => {
                    let loading = this.$loading({ target: '#drawerDevList' });
                    let data = {
                        id: alertData.spaceId,
                        type: alertData.spaceType == 'section' ? 1 : alertData.spaceType == 'project' ? 0 : '2'
                    }
                    this.checkSectionValue = data;
                    this.saveParams.checkSectionValue = data;
                    this.checkedkeys = [alertData.spaceId];

                    this.sectionId = alertData.spaceId;
                    this.saveParams.sectionId = alertData.spaceId;
                    this.saveParams.xqId = this.formSearch.xqId;
                    this.newSpaceType = alertData.spaceType;
                    this.chaX = 0;
                    this.chaY = 0;
                    this.moveX = 0;
                    this.moveY = 0;
                    this.zoom = .2;
                    let obj = {
                        spaceType: alertData.spaceType,
                        spaceId: alertData.spaceId,
                        subsystem:
                            this.$route.path == '/iot_device_2d'
                                ? this.subsystemCode
                                : this.$route.path.replace('/', ''),
                    };
                    this.saveParams.spaceData = obj;
                    this.getImg(obj, false);
                    // this.refreshPoint();
                    let param = {
                        projectId: this.formSearch.xqId,
                        spaceId: alertData.spaceId,
                        spaceType: alertData.spaceType,
                        subsystem: alertData.subsystem,
                        // subsystem:this.subsystemCode
                    };
                    // if (path != 'iot_device_2d') {
                    //     param.subsystem = this.$route.path.replace('/', '');
                    // }
                    // 
                    getPointBySecId(param).then((res) => {
                        if (res.data.ok) {
                            this.pointList = res.data.data;
                            this.saveParams.pointList = this.pointList;
                            this.deviceDataList = res.data.data;
                            this.devicedata = this.deviceDataList;
                            this.IbmsDeviceReadDTO = this.deviceDataList;
                            loading.close();
                            sessionStorage.setItem('devicedata', JSON.stringify(this.devicedata))
                            
                            this.$refs.pointRef.openPopoverRef(alertData.deviceId);//显示报警设备；
                        }
                    });
                    getPointBySecIdState(param).then((res) => {
                        if (res.data.ok) {
                            this.deviceDataListState = res.data.data;
                        }
                    })
                })
            },

        },
        beforeRouteEnter(to, from, next) {

            next((vm) => {
                vm.getPreviousRoute(from)
            });
        },
        mounted() {
            this.init();
            this.saveParams.xqId = this.formSearch.xqId;
            // setTimeout(() => {
            //     this.$emit('getData', this.saveParams);
            // }, 300);
            this.$set(this.saveParams, 'spaceType', this.viewType);
            if (this.viewType == 3) {

                let timedtask = true;//默认打开详情开始定时读数据任务，部分系统不需要（监控系统，门禁系统）
                if (this.$route.path == '/iot_vscs') {//门禁
                    timedtask = false;
                } else if (this.$route.path == '/iot_acs') {//门禁
                    timedtask = false;;
                } else if (this.$route.path == '/iot_ips') {//报警
                    timedtask = false;
                }
                // if (timedtask == true) {
                //     this.timer = window.setInterval(() => {
                //         setTimeout(() => {
                //             this.ReadCommand()
                //         }, 0);
                //     }, 4000)
                // }
                // this.timer = window.setInterval(() => {
                //     setTimeout(() => {
                //         this.ReadCommand()
                //     }, 0);
                // }, 4000)
            }

            // this.$nextTick(()=>{
            //     if(this.$route.path != '/iot_device_2d'){
            //         this.zoom = 1;
            //     }
            // })

            // this.$emit('getData', this.saveParams);
        },
        beforeDestroy() {
            if (this.timer) { //如果定时器还在运行 或者直接关闭，不用判断
                clearInterval(this.timer); //关闭
                console.log("关闭定时器");
            }
        },
        components: {
            point,
            deviceCard,
            devicelistv,
            diantiCard,//电梯
            videomonitoringsystem,//视频监控
            iotAcsCard,//门禁系统
            iotCisCard,
            iotIpsCard,
            DmbCard,
            iotAcsLog, //门禁日志
            iotAcsLogSearch,
            iotCisLog, 
            iotCisLogSearch,
            iotCisLog2, 
            iotCisLogSearch2,
            iotSenseLog,
            iotSenseLogSearch
        },
    };
</script>

<style scoped lang='scss'>
    .deviceviewbox {
        /* width: 1000px; */
        display: flex;
        flex-wrap: wrap;
    }

    .drawerDevList {
        height: 100%;
    }

    .cadBind {
        height: 100%;
        position: relative;
        left: 0;
        top: 0;
        overflow: hidden;
        background: #fff;

        .condition {
            width: 190px;
            border-right: 1px solid #e1e1e1;
            box-shadow: 6px 0 20px #ededed;
            position: relative;
            overflow-x: hidden;
            padding: 10px 5px 0px 5px;
        }

        .condition::-webkit-scrollbar {
            display: none;
        }

        .btn {
            margin: 0px 0px 10px 10px;
        }

        .searchBox {
            color: #333;
            position: absolute;
            left: 200px;
            right: 0;
            height: 100%;
            border-left: 10px solid #eee;
            background: #fff;
            overflow-y: scroll;
            overflow-y: scroll;
            // background: skyblue;
            .operateBar {
                $operateH: 48px;
                height: $operateH;
                border-bottom: 4px solid #eee;
                display: flex;
                line-height: $operateH;
                font-size: 16px;

                &>div:nth-child(1) {
                    flex: 4;
                    text-indent: 0.3rem;

                    .operateTop {
                        display: flex;
                        text-indent: 0;

                        .viewType {
                            text-align: center;
                            border: 1px solid var(--themeColor);
                            height: $operateH - 2;
                            cursor: pointer;

                            &>span {
                                height: $operateH - 2;
                                padding: 0 20px;
                                display: inline-block;
                            }
                        }

                        & /deep/ .el-breadcrumb {
                            height: $operateH;
                            line-height: $operateH;
                        }
                    }
                }

                &>div:nth-child(2) {
                    flex: 7;
                }
            }

            .commonTable {
                position: absolute;
                top: 60px;
                bottom: 0;
                left: 0;
                right: 0;
                overflow-y: scroll;
            }

            .commonTable::-webkit-scrollbar {
                width: 0;
            }

            .cadImg {
                position: absolute;
                top: 48px;
                bottom: 0;
                width: 100%;
                overflow: hidden;
                // overflow-y: scroll;
                background-size: center !important;
                z-index: 100;
                font-size: 50px;
                /* .mark {
                z-index:9999;
                display: inline-block;
                $mark: 32px;
                width: 32px;
                height: 32px;
                cursor: move;
                position: absolute;
                left: 0;
                top: 0;
            } */
                /* .mark {
                $mark: 24px;
                display: inline-block;
                width: $mark;
                height: $mark;
                border-radius: $mark;
                position: relative;
            }
            .mark:nth-child(n + 1) {
                background: #1f807f;
                left: 805px;
                top: 484px;
            }
            .mark:nth-child(n + 2) {
                background: red;
                left: 428px;
                top: 234px;
            }
            .mark:nth-child(n + 3) {
                background: gray;
                left: 166px;
                top: 276px;
            } */
            }

            .noImg {
                height: 100%;
                position: relative;
                text-align: center;
                z-index: 998;

                &>div {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                }
            }
        }
    }

    .dev {
        /* 无法选中字体 */
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;

        text-align: center;
        display: inline-block;
        margin: 20px 0;

        &>span {
            cursor: pointer;
            display: inline-block;
            $door: 36px;

            width: $door;
            height: 45.6px;
            // border-radius: 50%;
        }

        .defaultSvg {
            // background: url('../../assets/images/iot_svg/fan.svg') no-repeat;
            background: url('../../assets/images/defaultDev.png') no-repeat;
        }

        .doorMagnetic {
            background: url('../../assets/images/door_close_on.svg') no-repeat;
        }

        .camera {
            background: url('../../assets/images/camera1.svg') no-repeat;
        }

        .alarm {
            background: url('../../assets/images/alarm1.svg') no-repeat;
        }

        .parking {
            background: url('../../assets/images/parking1.svg') no-repeat;
        }
    }

    .drawer {
        .deviceList {
            position: absolute;
            top: 210px;
            bottom: 10px;
            overflow-y: scroll;
            width: 100%;

            .dev {
                width: 30%;
            }
        }
    }

    .marginLeft10 {
        margin-left: 10px;
        width: none !important;
    }

    .marginLeft10+.el-input {
        width: none !important;
    }

    .cadBind>div {
        display: inline-block;
        height: 100%;
    }

    .form_demo {
        padding: 0 10px;
    }
    .searchTip{
        border-bottom: 10px solid #eee;
    }
</style>